import { Component, OnInit, DoCheck } from '@angular/core';
import { Router, Params, ActivatedRoute } from '@angular/router';

import { AppComponentServer }  from './app.componentServer';

import 'rxjs/add/operator/switchMap';
import { Observable } from 'rxjs/Observable';




@Component({
  moduleId: module.id,
  selector: 'my-app',
  templateUrl: 'app.component.html',
  styleUrls:["./default.css","./menu.css","./meanmenu.min.css","./elegant-font.css","./header.css","./footer.css","./responsive.css"]
})

export class AppComponent implements OnInit, DoCheck { 
  navDatas: any[];
  errorMessage: string;
  meanNavFlag: boolean = false;
  routerPath: string ;
  oldRouterPath: string;
  bannerUrl: string = "assets/img/slider/1.jpg";
  title: string = "sopzon 2017 collections";
  titleCtrl: boolean = true;
  scrolled:number = 0;
  toTop:boolean = false;

  constructor(
    private route: ActivatedRoute,
    private appComponentServer: AppComponentServer,
    private router: Router) { }

  ngOnInit(): void {
    this.getNavDatas();
    this.routerPath = "home";
     window.addEventListener('scroll', this.handleScroll);
     this.changeBanner();
  }

  ngDoCheck() {
    this.routerPath = window.location.href.split('/')[3];
    if(this.routerPath != this.oldRouterPath){
      this.changeBanner();
    }
  }

  getNavDatas(): void {
  	this.appComponentServer.getNavDatas().then(
                       navDatas => this.navDatas = navDatas,
                       error =>  this.errorMessage = <any>error);
  }

  meanNavCtrl(): void{
  	this.meanNavFlag = !this.meanNavFlag;
  	
  }

  mobileMenuCtrl(navDataItem: any): void{
  	if(navDataItem.hasChild){
  		navDataItem.hideChild = !navDataItem.hideChild;
  	}else{
  		let thisTarget = navDataItem.link;
  		this.router.navigate([thisTarget]);
		  this.meanNavFlag = !this.meanNavFlag;
      this.oldRouterPath = this.routerPath;
      this.routerPath = thisTarget;
  	}
  }

  closeMobileMenuCtrl():void{
    this.meanNavFlag = false;
  }

  PCMenuCtrl(navDataItem: any): void{
    if(navDataItem.hasChild){
      navDataItem.hideChild = !navDataItem.hideChild;
    }else{
      let thisTarget = navDataItem.link;
      this.router.navigate([thisTarget]);
      this.meanNavFlag = !this.meanNavFlag;
      this.oldRouterPath = this.routerPath;
      this.routerPath = thisTarget;
    }
  }

  changeBanner(): void{
    if(this.routerPath == "home"){
       this.bannerUrl = "assets/img/slider/1.jpg";
       this.title = "sopzon 2017 collections";
       this.titleCtrl = true;
    }else{
      this.bannerUrl = "assets/img/other/banner-bg.jpg"
      this.title = this.routerPath;
      this.titleCtrl = false
    }
  }

  handleScroll () {
    this.scrolled = window.scrollY;
    this.toTop = !this.toTop;   
  }

  
}
